<template>
  <div>
    <p :style="{opacity}">React真难啊学不会</p>
    <button @click="destory">干掉他 我们一起学vue</button>
  </div>
</template>

<script>
export default {
name:"App",
data(){
  return {
    opacity:1,
    timer:null
  }
},
methods:{
   // 完全销毁一个实例。清理它与其它实例的连接，解绑它的全部指令
  destory(){
    this.$destroy()
  },
  mounted(){
    /* 生命周期函数中的this指向组件实例 */
console.log(this)
this.timer = setInterval(()=>{
  this.opacity -= 0.1;
  if(this.opacity<=0){
    this.opacity=1;
  }
   console.log(1);
},200);
  },
  beforeDestroy(){
     clearInterval(this.timer);
  }
}
}
</script>

<style>

</style>